/* 
root
flex
body
Text

*/

@font-face {
    font-family: 'Sofia-Simple';
    src: url('/fonts/Sofia-Regular.woff') format('woff'),
        url('/fonts/Sofia-Regular-converted.otf') format('opentype'),
        url('/fonts/Sofia-Regular.ttf') format('truetype'),
        url('/fonts/Sofia-Regular.svg#Sofia-Regular') format('svg');
}


:root {
    /*--TextColourDefault: #454545;*/
    --ColourWhite: white;
    --BackgroundColour: #111217;

    --widthViewSmall: 1vw;
    --widthViewMedium: 3vw;
    --widthViewLarge: 5vw;

    --heightViewSmall: 1vh;
    --heightViewMedium: 3vh;
    --heightViewLarge: 5vh;

    --sizeEmVSmall: 0.25em;
    --sizeEmSmall: 1em;
    --sizeEmMedium: 2em;
    --sizeEmLarge: 3em;
    --sizeEmText: 0.5em;

    --StoreImgHeightBig: 6em;
    --StoreImgHeightMedium: 5em;
    --StoreImgHeightSmall: 4em;

    --sectionBackgroundColour1: var(--BackgroundColour);
    /*banner*/
    --sectionBackgroundColour2: #27272d;
    /*first screenshot*/
    --sectionBackgroundColour3: #353E5A;
    --sectionBackgroundColour4: #383940;
    
    /*third screenshot*/
    --textSizeXXLarge: xx-large;
    --textSizeXLarge: x-large;
    --textSizeLarge: large;
    --textSizeMedium: medium;
    --textSizeSmall: small;
    --textSizeSmaller: 80%;
    --footerTextOpacity: 0.8;

    --MarginHR: 2.5em;
    --BorderHSize: 1px;
    --BorderHColour: #ffffff3a;
}

.flex-container {
    display: flex;
    height: 100vh;
    justify-content: center;
    align-items: center;
    line-height: 1;
}

body {
    background-color: var(--BackgroundColour);
    padding: 0;
    margin: 0;
    border: 0;
    line-height: 1;
    vertical-align: top;
}


/* Layout */

section {
    display: flex;
    padding: 0;
    width: 100%;
    margin: 0;
    border: 0;
    line-height: 1;
    vertical-align: top;
    justify-content: center;
    z-index: 1;
    position: relative;
}

div {
    padding: 0;
    margin: 0;
    border: 0;
    line-height: 1;
    vertical-align: top;
}


/* Containers */

container {
    display: flex;
    padding: 0;
    margin: 0;
    border: 0;
    width: 100%;
    flex-direction: row;
    z-index: 3;
    max-width: 98vmin;
    align-items: center;
}

container.row-reverse {
    flex-direction: row-reverse;
}

container.store {
    flex-wrap: nowrap;
    max-height: var(--StoreImgHeightBig);
}


container.column {
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
    flex-wrap: nowrap;
}

container.columnLeft {
    flex-direction: column;
}



.absdiv {
    padding: 0;
    width: 100%;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 2;
}


/* footer containers */

footerContacts {
    display: flex;
    padding: 0 var(--sizeEmVSmall);
    margin: 0;
    border: 0;
    list-style: none;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    overflow: hidden;
}

footerElement {
    display: flex;
    padding: 0;
    margin: 0;
    border: 0;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    flex-wrap: nowrap;
    overflow: hidden;
}

footerElement div {
    padding: var(--sizeEmText);
    overflow: hidden;
}


/* media overrides */

@media screen and (max-width: 991px) {
    /* start of large tablet styles */
    container {
        max-width: 85vw;
    }

}

@media screen and (max-width: 767px) {
    /* start of medium tablet styles */
    container {
        max-width: 90vw;
    }

}

@media screen and (max-width: 479px) {
    /* start of phone styles */
    container {
        max-width: 95vw;
    }

}


/* Type */

body,
input,
select,
textarea {
    color: #ffffff;
    font-family: "Source Sans Pro", Helvetica, sans-serif;
    font-size: var(--textSizeMedium);
    font-weight: 100;
    line-height: 1.65;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}

a {
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
    border-bottom: dotted 1px rgba(255, 255, 255, 0.35);
    color: #ffffff;
    text-decoration: none;
}

a.image{
    border-bottom-color: transparent;
    color: #ffffff !important;
}


a:hover {
    border-bottom-color: transparent;
    color: #ffffff !important;
}

strong,
b {
    color: #ffffff;
    font-weight: 300;
}

em,
i {
    font-style: italic;
}

p {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}

p.content {
    padding: var(--sizeEmText) var(--sizeEmText) var(--sizeEmText) 0;
    font-size: var(--textSizeLarge);
}

p.sha256 {
    padding: var(--sizeEmText) var(--sizeEmText) var(--sizeEmText) 0;
    font-size: var(--sizeEmSmall);
}

p.footer {
    font-size: var(--textSizeSmall);
    opacity: var(--footerTextOpacity);
    padding: var(--PaddingText);
}

h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span,
h1.major,
h2.major,
h3.major,
h4.major,
h5.major,
h6.major,
h1 {
    font-size: var(--textSizeXXLarge);
}

h1.Sofia{
    /*font-family:'Sofia-Simple',  Fallback, sans-serif;*/
    font-family:"Source Sans Pro", Helvetica, sans-serif;
    font-weight: bold;
}



h2 {
    font-size: var(--textSizeXLarge);
}

h3 {
    font-size: var(--textSizeLarge);
}

h3.bottomBoarder {
    border-bottom-style: solid;
    border-bottom-width: var(--BorderHSize);
    border-bottom-color: var(--BorderHColour);
    padding-bottom: var(--heightViewSmall);
}

h4 {
    font-size: var(--textSizeMedium);
}

sub {
    font-size: var(--textSizeSmaller);
    position: relative;
    top: var(--PaddingText);
}

sup {
    font-size: var(--textSizeSmaller);
    position: relative;
    top: var(--PaddingText);
}

hr {
    border: 0;
    margin: var(--MarginHR);
}

hr.major {
    margin: calc(var(--MarginHR) * 2) 0;
}

.align-left {
    text-align: left;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}


/* Lists */

ul {
    list-style-type: circle;
    margin: 0;
    line-height: 1;
}

ol {
    list-style-type: circle;
    margin: 0;
    line-height: 1.6;
}


li {
    list-style-type: circle;
    margin: 0;
    padding: 0 var(--sizeEmText) var(--sizeEmText) 0;
    font-size: var(--textSizeLarge);
    vertical-align: middle;
}


/* More */